<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{{ $game_channel['name'] }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="hotcss" content="design-width=640 max-width=640 initial-dpr=1">
    <link href="/vendor/layui-v2.8.8/layui/css/layui.css?v={{ time() }}" rel="stylesheet">
    <script src="/vendor/layui-v2.8.8/layui/layui.js?v={{ time() }}"></script>
    @vite(['resources/scss/juheh5.scss', 'resources/js/juheh5.js', 'resources/js/vuecomponents/components.js'])
</head>
<style>
    body {
        background-color: #000;
        overflow: hidden;
    }
</style>
<body>
    <div class="container" id="vapp">
        <wan-juhe-h5-game
            ref="h5Game"
            v-model="params">
        </wan-juhe-h5-game>
    </div>
</body>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const app = vueCreateApp({
            data() {
                return {
                    params: {
                        isWechat: {{ $is_wechat }},
                        isPhone: {{ $is_phone }},
                        game: @json($game),
                        gameChannel: @json($game_channel),
                        gameLoginConfig: @json($game_login_config),
                        query: @json($query),
                    }
                }
            },
            mounted() {
                this.bindMessage()
            },
            methods: {
                // 绑定接收事件通知处理
                bindMessage() {
                    const _this = this;
                    window.addEventListener('message', function (e) {
                        const data = e.data;
                        _this.handleMessage(data.event_name, data.params, data.cbid);
                    });
                },
                // 当收到jssdk的事件时，通知组件进行处理
                handleMessage(event_name, params, cbid) {
                    this.$refs.h5Game.handleMessageToIframe(event_name, params, cbid);
                }
            }
        })
        let component = '{{ $vue_component }}';
        console.log(component)
        app.component('WanJuheH5Game', vueComponents[component])
        app.mount('#vapp')
    })
</script>
</html>
